/* body */
body {
    background-color: #f7f7f7;
}


/* ----- banner横幅 ----- */
.banner {
    width: 100%;
    background-color: #01c2ed;
}

.banner .banner-img {
    height: 473px;
    background: url(../imgs/img/专区页banner.png);
    background-position-x: center;
}

/* banner内容 */
.banner .banner-con {
    width: 270px;
    height: 395px;
    background-color: rgba(0, 0, 0, .35);
    padding: 0 20px;
    color: #fff;
    border-radius: 10px;
    top: 36px;
    right: 40px;
}

.banner-con .txt-title {
    font-size: 24px;
    line-height: 52px;
    text-align: center;
}

.banner-con .txt-li {
    border-bottom: 1px dashed #fff;
    padding-bottom: 15px;
    margin-bottom: 10px;
}

.txt-li .txt-h {
    font-size: 16px;
}

.txt-li .txt-p {
    margin-top: 5px;
    padding: 0 10px;
}

.txt-li .txt-a {
    line-height: 14px;
    color: #fff;
    margin-left: 10px;
}

.txt-li .txt-a:hover {
    color: #fddc3b;
}

/* ----- 产品推荐 ----- */
/* 上边 */
.recommend-top {
    margin-bottom: 25px;
}

.recommend-top .top-li:nth-child(1) {
    width: 234px;
    height: 370px;
    background-color: #fff;
}

.recommend-top .top-li:nth-child(n+2) {
    width: 470px;
    height: 370px;
    margin-left: 13px;
    background-color: #fff;
}

.top-li .top-p {
    line-height: 50px;
    padding: 0 15px;
}

.top-li .top-span {
    font-size: 24px;
    font-weight: 700;
    color: #333;
}

.top-li .top-btn {
    display: block;
    width: 23px;
    height: 23px;

}

/* hover文本内容 */
.recommend-top .top-con {
    overflow: hidden;
}

.top-con .con-a {
    display: block;
    width: 234px;
    height: 320px;
}

.top-con .con-box {
    height: 56px;
    left: -200px;
    bottom: 40px;
    transition: all 0.5s;
}

.top-con .con-logo {
    width: 56px;
    height: 56px;
    padding: 8px;
    background-color: rgba(0, 0, 0, .8);
}

.top-con .con-txt {
    width: 144px;
    height: 56px;
    background-color: rgba(0, 0, 0, .5);
    color: #fff;
    padding: 4px 10px;
}

.top-con .con-box .con-span:nth-child(1) {
    display: block;
    font-size: 18px;
    font-weight: 700;
    margin-bottom: 4px;
}

.top-con .con-box .con-span:nth-child(2) {
    display: block;
    color: #fff;
}

.top-li:nth-child(n+2) .top-txt {
    display: block;
    width: 136px;
    line-height: 14px;
    margin-left: 10px;
    transform: translateY(168%);
    color: #9f9f9f;
    float: left;
}

.recommend-top .top-li:nth-child(n+2) .con-txt {
    width: 324px;
}

.recommend-top .top-li:nth-child(n+2) .con-box {
    left: -380px;
}

.recommend-top .top-con:hover .con-box {
    left: 0;
}

/* 下边 */

.recommend-btm .btm-li {
    margin-left: 20px;
    float: left;
}

.recommend-btm .btm-li:nth-child(1) {
    margin-left: 0;
}

/* ----- 女装热销 ----- */
/* 产品标题 */
.product {
    padding: 30px 0 10px;
}

.product-title {
    width: 521px;
    height: 100px;
    text-align: center;
    margin: 0 auto;
}
.product-title .title-img{
    display: inline-block;
    transform: translateY(-15%);
}
.product-title .title-ctr{
    font-size: 30px;
    letter-spacing: 2px;
    font-weight: 700;
    color: #333;
    margin: 0 45px;
}
.product-title::after{
    content: 'Ladies Fashion Hot Sell';
    display: block;
    font-size: 14px;
    color: #8f8f8f;
    letter-spacing: 2px;
    position: absolute;
    top: 45px;
    left: 50%;
    transform: translateX(-50%);
}

/* 产品内容 */
.product-con{
    height: 420px;
    padding-bottom: 10px;
}
/* 左边 */
.product-con .con-left{
    margin-right: 15px;
}
.con-left .con-txt{
    margin: 0 auto;
    padding: 15px 13px;
    top: 5px;
}
.con-txt .txt-li{
    width: 113px;
    line-height: 35px;
    font-size: 18px;
    font-weight: 700;
    text-align: center;
    color: #fff;
    background-color: rgba(250, 250, 250, .15);
    border: 1px solid #fff;
    margin: 7px 5px;
}
/* 中间 */
.product-con .con-ctr{
    width: 624px;
    margin-right: 15px;
}
.con-ctr .ctr-li{
    width: 312px;
    height: 205px;
}
/* 右边 */
.product-con .con-right{
    width: 274px;
    height: 410px;
    background: url(../imgs/img/selings-right-bg.png);
    background-color: #fff;
    padding: 0 20px;
}
.con-right .right-title{
    padding-top: 15px;   
}
.right-title .title-span:nth-child(1){
    font-size: 18px;
    font-weight: 700;
    letter-spacing: 2px;
    color: #333;
}
.right-title .title-span:nth-child(2){
    font-size: 12px;
    font-weight: 700;
    color: #9f9f9f;
}
.con-right .right-con{
    font-weight: 700;
    color: #333;
    padding: 14px 0;
    border-bottom: 1px solid rgba(0, 0, 0, .2);
}
.con-right .right-con:last-child{
    border-bottom: none;
}
.right-con .con-box-img{
    width: 99px;
    height: 99px;
    background: url(../imgs/img/颜色填充.png);
    margin-right: 10px;
}
.right-con .box-img-txt{
    display:block;
    width: 16px;
    font-size: 12px;
    line-height: 18px;
    text-align: center;
    color: #fff;
    transform: translateX(75px);
}
.right-con .con-box-p:nth-child(2){
    font-weight: 700;
    color: #333;
    margin-bottom: 30px;
}
.right-con .con-box-p:nth-child(3){
    font-size: 18px;
    font-weight: 700;
    color: #333;
}
.con-box-p .con-box-span{
    font-size: 14px;
    color: #7b7b7b;
}
.right-con .right-con-box{
    display: none;
}
.con-right .right-con.active .right-con-p{
    display: none;
}
.con-right .right-con.active .right-con-box{
    display: block;
}

/* ----- 品牌专区 ----- */

/* 产品内容 */
/* 上边 */
.product .con-top{
    padding: 20px 35px;
}
.con-top .con-top-li:nth-child(1){
    width: 565px;
    height: 275px;
    margin-right: 30px;
}
.con-top .con-top-li:nth-child(2){
    width: 495px;
    height: 275px;
}
.con-top .con-top-h{
    font-size: 30px;
    font-weight: 700;
    letter-spacing: 2px;
    color: #333;
}
.con-top .con-top-p{
    font-size: 16px;
    line-height: 40px;
    color: #808080;
    margin-bottom: 40px;
}
.con-top .con-top-a{
    display: block;
    width: 324px;
    line-height: 62px;
    font-size: 24px;
    text-align: center;
    color: #333;
    border: 1px solid #808080;
}
/* 下边 */

.product .con-btm{
    padding:25px 0 70px;
}
.product .con-btm .btm-li{
    margin-left: 9px;
}
.product .con-btm .btm-li:nth-child(1){
    margin-left: none;
}







